import { useRef, MutableRefObject, useContext } from 'react'
import { useLocation } from 'react-router-dom'
import { formatQuery } from '../../../util/util'
import './search.scss'
type TSearch = {
  sendMessage: (value: string) => void
}
const ChatSearch = (props: TSearch) => {
  const { sendMessage } = props
  const a = useLocation()
  const inputEl: MutableRefObject<HTMLInputElement | null> = useRef(null)
  const sendContent = () => {
    console.log(formatQuery(a.search.slice(1)))
    sendMessage(inputEl.current!.value)
  }
  return (
    <div className="chatSearch">
      <input type="text" placeholder="请输入" ref={inputEl} />
      <span onClick={sendContent}>发送</span>
    </div>
  )
}
export default ChatSearch
